<script>
import {reactive, shallowReactive, ref, shallowRef, readonly, onMounted} from "vue";
import Son from "@/components/son.vue";

export default {
  name: "App",
  components: {Son},
  setup(props, context) {
    // 1.定义一个person的reactive
    let person = reactive({
      name: "陶品奇",
      age: 22,
      address: "衡阳"
    })

    //3.定义一个change方法
    const change = () => {person.age++}
    return {person, change}
  }
}
</script>
<template>
  <div id="app">
    <h1>App：{{ person }}</h1>
    <!--2.将person传递给子组件son,同时监听子组件son的change事件-->
    <son :person="person" @change="change"></son>
  </div>
</template>

<style lang="less">

</style>
